{% extends 'video/videos/index.html' %}
{% block head1 %}
<title>视频分类</title>
{% endblock %}
{% block main %}

<div class="1f11a9 block">
    <h5 class="93453b has-text-weight-bold is-size-5">{{ query }}共计{{ count }}个视频</h5>
</div>




<div class="23c2e4 tabs" id="rd4">
    <ul>
                        <li class="28ecda is-active">
                    <a href="/search?keywords={{ query }}">最新</a>
                </li>

                <li class="ec5ac1 ml-auto">
            <small>视频列表：第<b>{{ videos.number }}</b>页</small>
        </li>
    </ul>
</div>
<script type="text/javascript">
    window.$m('rd4')
</script>

<div class="2f4cf5 block">

<div id="rd5" class=""><div class="735fec columns is-multiline is-mobile is-variable is-2-tablet is-1-mobile">
    {%for video in videos%}
    <div class="917ccb column is-one-quarter-tablet is-half-mobile py-1">
    <article class="8ffa6c card is-shadowless">
        <div class="357ff6 card-image is-clipped">
            <a href="/video/view/{{ video.id }}">
                <figure class="60be9b image is-5by3 is-relative">
                    <img loading="lazy" alt="{{ video.name }}" src="/media/{{ video.picture }}">
                </figure>
                <span class="35e5f5 duration">00:00:17</span>
                            </a>
        </div>
        <div class="ffa388 card-content px-0 py-2">
            <div class="414565 content">
                <h4 class="e99e9d is-size-7 is-size-7-mobile mb-1 has-text-line-2 has-text-weight-normal">
                    <a target="_self" href="/video/view/{{ video.id }}" class="b8ca44 has-text-grey-dark">
                        {{ video.name }}                    </a>
                </h4>
                <p class="710319 mb-1 has-text-grey is-size-8">
                    作者: <a class="6aaa3d has-text-grey-dark" href="/author/%E5%8C%BF%E5%90%8D">匿名</a>
                </p>
                <p class="e85073 has-text-grey is-size-8">
                    <time datetime="{{ video.createdate }}">{{ video.createdate|date:"Y年m月d日" }}</time>&nbsp;|&nbsp;{{ video.click_num }}次播放
                </p>
            </div>
        </div>
    </article>
</div>
{%endfor%}

</div></div>
{% if obj.has_other_pages %}
<nav aria-label="Contacts Page Navigation" >
        <ul class="pagination justify-content-center m-2" >
            {% if obj.has_previous %}
            <li class="">
                <a class="page-link" href="/video/?page={{ obj.previous_page_number }}">«</a>
            </li>
            <li class="">
                <a class="page-link" href="/video/?page=1">1</a>
            </li>
            <li>
                <span class="pagination-ellipsis">...</span>
            </li>
            {% endif %}
            <li class="page-item active">
                <a class="page-link" href="/video/?page={{ obj.number }}">{{ obj.number }}</a>
            </li>
            {% if obj.has_next %}
            <li>
                <span class="pagination-ellipsis">...</span>
            </li>
            <li class="page-item">
                <a class="page-link" href="/video/?page={{ obj.paginator.num_pages }}">{{ obj.paginator.num_pages }}</a>
            </li>
            <li class="">
                <a class="page-link" href="/video/?page={{ obj.next_page_number }}">
                    <span aria-hidden="true">»</span>
                </a>
            </li>
            {% endif %}
            <li class="2b56ea ml-3">
            <form action="/video">
                <input type="number" name="page"  class="fd38c3 input mr-2" value="1" style="width: 5rem" max="1765" min="1" />
                <button type="submit" class="0d59fa button">跳转</button>
            </form>
            </li>
        </ul>


    </nav>
{% endif %}

</div>


{% endblock %}